// Studio X 网站交互脚本
// 作者: AI Assistant
// 功能: 轮播指示器、导航交互、滚动动画等

// 移动端滚动优化
function initMobileScroll() {
    // 防止iOS Safari的弹性滚动问题
    document.addEventListener('touchstart', function(e) {
        if (e.touches.length > 1) {
            e.preventDefault();
        }
    }, { passive: false });
    
    // 防止双击缩放
    let lastTouchEnd = 0;
    document.addEventListener('touchend', function(e) {
        const now = (new Date()).getTime();
        if (now - lastTouchEnd <= 300) {
            e.preventDefault();
        }
        lastTouchEnd = now;
    }, false);
    
    // 确保页面可以正常滚动
    document.body.style.webkitOverflowScrolling = 'touch';
    document.body.style.overflowY = 'auto';
    
    // 修复iOS Safari的滚动问题
    if (/iPad|iPhone|iPod/.test(navigator.userAgent)) {
        document.body.style.position = 'relative';
        document.body.style.height = 'auto';
        document.body.style.minHeight = '100vh';
    }
}

// 全局变量
let currentSlide = 0;
let carouselInterval;

// 页面加载完成后初始化
document.addEventListener('DOMContentLoaded', function() {
    // 初始化移动端滚动优化
    initMobileScroll();
    
    // 优先使用本地config.js数据初始化页面（同步执行，确保页面内容立即显示）
    try {
        initPage();
        initCarouselIndicators();
        initImageErrorHandling();
        initProjectClickEvents();
        
        console.log('页面基础内容初始化完成');
    } catch (error) {
        console.error('页面基础内容初始化失败:', error);
    }
    
    // 异步初始化底部统计和点赞功能（不阻塞页面加载）
    // 使用requestIdleCallback确保在浏览器空闲时执行
    if (window.requestIdleCallback) {
        requestIdleCallback(() => {
            initFooterFeatures();
        }, { timeout: 2000 });
    } else {
        // 降级处理：使用setTimeout
        setTimeout(() => {
            initFooterFeatures();
        }, 100);
    }
});

// 初始化页面内容
function initPage() {
    // 更新页面标题
    document.title = profileData.profile.pageTitle;
    
    // 更新页面标题
    updateElementText('.studio-title', profileData.profile.title);
    
    // 更新个人介绍
    updateElementText('.intro-section .section-title', profileData.profile.introduction.title);
    updateElementText('.intro-section .intro-text', profileData.profile.introduction.content);
    
    // 更新技术栈
    updateElementText('.skills-section .section-title', profileData.profile.skills.title);
    updateSkillsSection();
    
    // 更新工作经历（暂时隐藏）
    // updateElementText('.team-section .section-title', profileData.profile.workExperience.title);
    // updateWorkExperienceSection();
    
    // 更新精选项目
    updateElementText('.portfolio-section .section-title', profileData.profile.portfolio.title);
    updatePortfolioSection();
    
    // 更新开源项目
    updateElementText('.opensource-section .section-title', profileData.profile.openSource.title);
    updateOpenSourceSection();
    
    // 更新服务范围
    updateElementText('.services-section .section-title', profileData.profile.services.title);
    updateServicesSection();
    
    // 更新精选案例
    updateElementText('.cases-section .section-title', profileData.profile.cases.title);
    updateCasesSection();
    
    // 更新个人资料
    updateElementText('.contact-section .section-title', profileData.profile.contact.title);
    updateContactSection();
    
    // 更新教育经历
    updateElementText('.social-section .section-title', profileData.profile.education.title);
    updateEducationSection();
    
    // 更新轮播图
    updateHeroCarousel();
}

// 更新元素文本内容
function updateElementText(selector, text) {
    const element = document.querySelector(selector);
    if (element) {
        element.textContent = text;
    }
}

// 更新技术栈部分
function updateSkillsSection() {
    const skillsGrid = document.querySelector('.skills-grid');
    if (!skillsGrid || !profileData.profile.skills.items) return;
    
    skillsGrid.innerHTML = '';
    profileData.profile.skills.items.forEach(skill => {
        const skillCard = document.createElement('div');
        skillCard.className = 'service-card';
        skillCard.innerHTML = `
            <div class="service-icon">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    ${getSkillIcon(skill.icon)}
                </svg>
            </div>
            <h3 class="service-title">${skill.name}</h3>
        `;
        skillsGrid.appendChild(skillCard);
    });
}

// 获取技能图标
function getSkillIcon(iconType) {
    const icons = {
        'mobile': '<rect x="5" y="2" width="14" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/>',
        'layers': '<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/>',
        'cloud': '<path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z"/>',
        'users': '<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/>',
        'clock': '<circle cx="12" cy="12" r="10"/><polyline points="12,6 12,12 16,14"/>',
        'heart': '<path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/>',
        'server': '<rect x="2" y="2" width="20" height="8" rx="2" ry="2"/><rect x="2" y="14" width="20" height="8" rx="2" ry="2"/><line x1="6" y1="6" x2="6.01" y2="6"/><line x1="6" y1="18" x2="6.01" y2="18"/>',
        'code': '<polyline points="16,18 22,12 16,6"/><polyline points="8,6 2,12 8,18"/>',
        'zap': '<polygon points="13,2 3,14 12,14 11,22 21,10 12,10 13,2"/>',
        'cpu': '<rect x="4" y="4" width="16" height="16" rx="2" ry="2"/><rect x="9" y="9" width="6" height="6"/><line x1="9" y1="1" x2="9" y2="4"/><line x1="15" y1="1" x2="15" y2="4"/><line x1="9" y1="20" x2="9" y2="23"/><line x1="15" y1="20" x2="15" y2="23"/><line x1="20" y1="9" x2="23" y2="9"/><line x1="20" y1="14" x2="23" y2="14"/><line x1="1" y1="9" x2="4" y2="9"/><line x1="1" y1="14" x2="4" y2="14"/>',
        'smartphone': '<rect x="5" y="2" width="14" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/>',
        'globe': '<circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/>',
        'palette': '<circle cx="13.5" cy="6.5" r=".5"/><circle cx="17.5" cy="10.5" r=".5"/><circle cx="8.5" cy="7.5" r=".5"/><circle cx="6.5" cy="12.5" r=".5"/><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z"/>',
        'terminal': '<polyline points="4,17 10,11 4,5"/><line x1="12" y1="19" x2="20" y2="19"/>',
        'database': '<ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3"/><path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"/>',
        'git-branch': '<line x1="6" y1="9" x2="30" y2="9"/><path d="M6 3v12"/><path d="M18 9a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/><path d="M6 21a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>',
        'feather': '<path d="M20.24 12.24a6 6 0 0 0-8.49-8.49L5 10.5V19h8.5z"/><line x1="16" y1="8" x2="2" y2="22"/><line x1="17.5" y1="15" x2="9" y2="15"/>',
        'activity': '<polyline points="22,12 18,12 15,21 9,3 6,12 2,12"/>',
        'trending-up': '<polyline points="23,6 13.5,15.5 8.5,10.5 1,18"/><polyline points="17,6 23,6 23,12"/>'
    };
    return icons[iconType] || icons['mobile'];
}

// 更新工作经历部分
function updateWorkExperienceSection() {
    const teamGrid = document.querySelector('.team-grid');
    if (!teamGrid || !profileData.profile.workExperience.items) return;
    
    teamGrid.innerHTML = '';
    profileData.profile.workExperience.items.forEach(work => {
        const workItem = document.createElement('div');
        workItem.className = 'team-member';
        workItem.innerHTML = `
            <div class="member-avatar">
                <img src="${work.avatar}" alt="${work.company}">
            </div>
            <h3 class="member-name">${work.company}</h3>
            <p class="member-role">${work.position}</p>
            <p class="member-role">${work.period}</p>
        `;
        teamGrid.appendChild(workItem);
    });
}

// 更新精选项目部分
function updatePortfolioSection() {
    const portfolioGrid = document.querySelector('.portfolio-grid');
    if (!portfolioGrid || !profileData.profile.portfolio.items) return;
    
    portfolioGrid.innerHTML = '';
    profileData.profile.portfolio.items.forEach((project, index) => {
        const projectItem = document.createElement('div');
        projectItem.className = 'portfolio-item';
        projectItem.setAttribute('data-project-index', index);
        
        // 如果有链接，添加点击事件
        if (project.url) {
            projectItem.style.cursor = 'pointer';
            projectItem.addEventListener('click', () => {
                // 使用带loading效果的跳转函数
                navigateToProject(project.url, projectItem);
            });
        }
        
        projectItem.innerHTML = `
            <div class="portfolio-image">
                <img src="${project.image}" alt="${project.alt}">
            </div>
            <h3 class="portfolio-title">${project.name}</h3>
            <p class="portfolio-description">${project.description}</p>
        `;
        portfolioGrid.appendChild(projectItem);
    });
}

// 更新开源项目部分
function updateOpenSourceSection() {
    const opensourceGrid = document.querySelector('.opensource-grid');
    if (!opensourceGrid || !profileData.profile.openSource.items) return;
    
    console.log('开源项目数量:', profileData.profile.openSource.items.length);
    
    opensourceGrid.innerHTML = '';
    profileData.profile.openSource.items.forEach((project, index) => {
        console.log(`创建项目 ${index + 1}:`, project.name);
        const projectItem = document.createElement('div');
        projectItem.className = 'opensource-item';
        projectItem.setAttribute('data-opensource-index', index);
        
        // 如果有链接，添加点击事件
        if (project.url) {
            projectItem.style.cursor = 'pointer';
            projectItem.addEventListener('click', () => {
                // 使用带loading效果的跳转函数
                navigateToProject(project.url, projectItem);
            });
        }
        
        projectItem.innerHTML = `
            <div class="opensource-image">
                <img src="${project.image}" alt="${project.alt}">
            </div>
            <h3 class="opensource-title">${project.name}</h3>
            <p class="opensource-description">${project.description}</p>
        `;
        opensourceGrid.appendChild(projectItem);
    });
    
    console.log('开源项目DOM元素数量:', opensourceGrid.children.length);
}

// 更新服务范围部分
function updateServicesSection() {
    const servicesGrid = document.querySelector('.services-grid');
    if (!servicesGrid || !profileData.profile.services.items) return;
    
    console.log('服务范围数量:', profileData.profile.services.items.length);
    
    servicesGrid.innerHTML = '';
    profileData.profile.services.items.forEach((service, index) => {
        console.log(`创建服务 ${index + 1}:`, service.name);
        const serviceItem = document.createElement('div');
        serviceItem.className = 'services-item';
        serviceItem.setAttribute('data-service-index', index);
        
        serviceItem.innerHTML = `
            <span class="services-icon">${service.icon}</span>
            <h3 class="services-title">${service.name}</h3>
            <p class="services-description">${service.description}</p>
        `;
        servicesGrid.appendChild(serviceItem);
    });
    
    console.log('服务范围DOM元素数量:', servicesGrid.children.length);
}

// 全局变量：防止重复点击
let isCaseLoading = false;

// 显示Loading效果
function showLoading() {
    const loadingOverlay = document.getElementById('loadingOverlay');
    if (loadingOverlay) {
        loadingOverlay.classList.add('show');
    }
}

// 隐藏Loading效果
function hideLoading() {
    const loadingOverlay = document.getElementById('loadingOverlay');
    if (loadingOverlay) {
        loadingOverlay.classList.remove('show');
    }
}

// 带Loading效果的案例跳转函数
function navigateToCase(url, caseElement) {
    // 防止重复点击
    if (isCaseLoading) {
        return;
    }
    
    // 设置loading状态
    isCaseLoading = true;
    caseElement.classList.add('loading');
    
    // 显示loading效果
    showLoading();
    
    // 1秒后执行跳转
    setTimeout(() => {
        // 隐藏loading效果
        hideLoading();
        
        // 移除loading状态
        caseElement.classList.remove('loading');
        isCaseLoading = false;
        
        // 执行跳转
        window.open(url, '_blank');
    }, 1000);
}

// 带Loading效果的项目跳转函数
function navigateToProject(url, projectElement) {
    // 防止重复点击
    if (isCaseLoading) {
        return;
    }
    
    // 设置loading状态
    isCaseLoading = true;
    projectElement.classList.add('loading');
    
    // 显示loading效果
    showLoading();
    
    // 1秒后执行跳转
    setTimeout(() => {
        // 隐藏loading效果
        hideLoading();
        
        // 移除loading状态
        projectElement.classList.remove('loading');
        isCaseLoading = false;
        
        // 执行跳转
        window.open(url, '_blank');
    }, 1000);
}

// 更新精选案例部分
function updateCasesSection() {
    const casesGrid = document.querySelector('.cases-grid');
    if (!casesGrid || !profileData.profile.cases.items) return;
    
    console.log('精选案例数量:', profileData.profile.cases.items.length);
    
    casesGrid.innerHTML = '';
    profileData.profile.cases.items.forEach((caseItem, index) => {
        console.log(`创建案例 ${index + 1}:`, caseItem.name);
        const caseElement = document.createElement('div');
        caseElement.className = 'case-item';
        caseElement.setAttribute('data-case-index', index);
        
        // 判断是否有有效的URL
        const hasValidUrl = caseItem.url && caseItem.url.trim() !== '';
        
        if (hasValidUrl) {
            // 如果有有效链接，添加点击事件、鼠标样式和clickable类
            caseElement.classList.add('clickable');
            caseElement.addEventListener('click', () => {
                // 使用带loading效果的跳转函数
                navigateToCase(caseItem.url, caseElement);
            });
        } else {
            // 如果没有有效链接，添加coming-soon类
            caseElement.classList.add('coming-soon');
        }
        
        caseElement.innerHTML = `
            <div class="case-image">
                <img src="${caseItem.image}" alt="${caseItem.alt || caseItem.name}">
            </div>
            <h3 class="case-title">${caseItem.name}</h3>
            <p class="case-description">${caseItem.description}</p>
        `;
        casesGrid.appendChild(caseElement);
    });
    
    console.log('精选案例DOM元素数量:', casesGrid.children.length);
}

// 更新联系方式部分
function updateContactSection() {
    const contactInfo = document.querySelector('.contact-info');
    if (!contactInfo || !profileData.profile.contact.items) return;
    
    contactInfo.innerHTML = '';
    profileData.profile.contact.items.forEach(contact => {
        const contactItem = document.createElement('p');
        contactItem.className = 'contact-item';
        
        // 根据不同的联系信息类型添加不同的点击功能
        if (contact.label === '电话' || contact.label === '电话+微信') {
            // 电话点击拨号
            contactItem.innerHTML = `${contact.label}: <a href="tel:${contact.value}" class="contact-link">${contact.value}</a>`;
        } else if (contact.label === '微信') {
            // 微信点击复制微信号
            contactItem.innerHTML = `${contact.label}: <a href="#" class="contact-link wechat-copy" data-wechat="${contact.value}">${contact.value}</a>`;
        } else if (contact.label === '邮箱') {
            // 邮箱点击发送邮件
            contactItem.innerHTML = `${contact.label}: <a href="mailto:${contact.value}" class="contact-link">${contact.value}</a>`;
        } else if (contact.label === '个人git主页') {
            // 个人git主页点击跳转
            contactItem.innerHTML = `${contact.label}: <a href="${contact.value}" target="_blank" class="contact-link">${contact.value}</a>`;
        } else if (contact.label === '所在城市') {
            // 所在城市点击打开高德地图
            const cityName = contact.value.replace('中国-', ''); // 提取城市名称
            const amapUrl = `https://uri.amap.com/search?keyword=${encodeURIComponent(cityName)}&src=myapp`;
            contactItem.innerHTML = `${contact.label}: <a href="${amapUrl}" target="_blank" class="contact-link">${contact.value}</a>`;
        } else {
            // 其他信息正常显示
            contactItem.textContent = `${contact.label}: ${contact.value}`;
        }
        
        contactInfo.appendChild(contactItem);
    });
    
    // 为微信复制功能添加事件监听
    const wechatLinks = document.querySelectorAll('.wechat-copy');
    wechatLinks.forEach(link => {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            const wechat = this.getAttribute('data-wechat');
            if (navigator.clipboard) {
                navigator.clipboard.writeText(wechat).then(() => {
                    showToast('微信号已复制到剪贴板');
                }).catch(() => {
                    fallbackCopyTextToClipboard(wechat);
                });
            } else {
                fallbackCopyTextToClipboard(wechat);
            }
        });
    });
}

// 备用复制方法
function fallbackCopyTextToClipboard(text) {
    const textArea = document.createElement('textarea');
    textArea.value = text;
    textArea.style.position = 'fixed';
    textArea.style.left = '-999999px';
    textArea.style.top = '-999999px';
    document.body.appendChild(textArea);
    textArea.focus();
    textArea.select();
    
    try {
        const successful = document.execCommand('copy');
        if (successful) {
            showToast('微信号已复制到剪贴板');
        } else {
            showToast('复制失败，请手动复制');
        }
    } catch (err) {
        showToast('复制失败，请手动复制');
    }
    
    document.body.removeChild(textArea);
}

// 显示提示信息
function showToast(message) {
    // 创建提示元素
    const toast = document.createElement('div');
    toast.style.cssText = `
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: rgba(0, 0, 0, 0.8);
        color: white;
        padding: 12px 20px;
        border-radius: 6px;
        font-size: 14px;
        z-index: 10000;
        pointer-events: none;
    `;
    toast.textContent = message;
    
    document.body.appendChild(toast);
    
    // 2秒后移除提示
    setTimeout(() => {
        if (document.body.contains(toast)) {
            document.body.removeChild(toast);
        }
    }, 2000);
}

// 更新教育经历部分
function updateEducationSection() {
    const educationList = document.querySelector('.education-list');
    if (!educationList || !profileData.profile.education.items) return;
    
    educationList.innerHTML = '';
    profileData.profile.education.items.forEach(edu => {
        const eduItem = document.createElement('div');
        eduItem.className = 'education-item';
        
        // 根据学校名称设置对应的logo
        const logoUrl = getUniversityLogo(edu.school);
        
        // 从JSON配置中读取标签
        const tag = edu.tag || '';
        const tagHtml = tag ? `<span class="education-tag">${tag}</span>` : '';
        
        eduItem.innerHTML = `
            <div class="education-logo">
                <img src="${logoUrl}" alt="${edu.school}" onerror="this.src='https://via.placeholder.com/80x80/2b3036/ffffff?text=${encodeURIComponent(edu.school)}'">
            </div>
            <div class="education-info">
                <div class="education-header">
                    <h3 class="education-school">${edu.school}</h3>
                    <span class="education-major">${edu.major}</span>
                    <span class="education-degree">${edu.degree || '学位'}</span>
                    ${tagHtml}
                </div>
                <p class="education-period">${edu.period}</p>
            </div>
        `;
        educationList.appendChild(eduItem);
    });
}

// 获取大学logo URL
function getUniversityLogo(schoolName) {
    const logoMap = {
        '南京大学': 'images/njdx.jpeg',
        '江苏大学': 'images/jsdx.jpeg',
        '清华大学': 'https://via.placeholder.com/80x80/2b3036/ffffff?text=清华大学',
        '北京大学': 'https://via.placeholder.com/80x80/2b3036/ffffff?text=北京大学',
        '复旦大学': 'https://via.placeholder.com/80x80/2b3036/ffffff?text=复旦大学',
        '上海交通大学': 'https://via.placeholder.com/80x80/2b3036/ffffff?text=上海交通大学'
    };
    
    return logoMap[schoolName] || `https://via.placeholder.com/80x80/2b3036/ffffff?text=${encodeURIComponent(schoolName)}`;
}

// 更新轮播图内容
function updateHeroCarousel() {
    const carousel = document.querySelector('.hero-carousel');
    if (!carousel || !profileData.profile.heroCarousel || !profileData.profile.heroCarousel.slides) return;
    
    carousel.innerHTML = '';
    profileData.profile.heroCarousel.slides.forEach((slide, index) => {
        const slideDiv = document.createElement('div');
        slideDiv.className = `hero-slide ${index === 0 ? 'active' : ''}`;
        
        slideDiv.innerHTML = `
            <img src="${slide.image}" alt="${slide.alt}" class="hero-bg-image">
            <div class="hero-overlay"></div>
        `;
        
        carousel.appendChild(slideDiv);
    });
    
    // 重置当前幻灯片索引
    currentSlide = 0;
    
    // 重新初始化轮播指示器（会自动处理显示/隐藏逻辑）
    initCarouselIndicators();
}

// 初始化轮播指示器
function initCarouselIndicators() {
    const indicatorsContainer = document.querySelector('.carousel-indicators');
    const slides = document.querySelectorAll('.hero-slide');
    
    // 隐藏左右按钮（永久隐藏）
    const prevBtn = document.querySelector('.carousel-prev');
    const nextBtn = document.querySelector('.carousel-next');
    if (prevBtn) prevBtn.style.display = 'none';
    if (nextBtn) nextBtn.style.display = 'none';
    
    // 只有当图片数量大于1张时才显示指示器和启动自动轮播
    if (slides.length <= 1) {
        // 隐藏指示器容器
        if (indicatorsContainer) indicatorsContainer.style.display = 'none';
        return; // 不需要初始化轮播功能
    }
    
    // 显示指示器容器
    if (indicatorsContainer) indicatorsContainer.style.display = 'flex';
    
    // 动态创建指示器
    if (indicatorsContainer) {
        indicatorsContainer.innerHTML = '';
        slides.forEach((_, index) => {
            const indicator = document.createElement('div');
            indicator.className = `indicator ${index === 0 ? 'active' : ''}`;
            indicator.addEventListener('click', () => {
                goToSlide(index);
            });
            indicatorsContainer.appendChild(indicator);
        });
    }
    
    // 重置当前幻灯片索引
    currentSlide = 0;
    
    // 启动自动播放（3秒间隔）
    startAutoPlay();
    
    // 鼠标悬停暂停
    const heroSection = document.querySelector('.hero-section');
    if (heroSection) {
        heroSection.addEventListener('mouseenter', pauseAutoPlay);
        heroSection.addEventListener('mouseleave', startAutoPlay);
    }
}

// 跳转到指定幻灯片
function goToSlide(index) {
    const slides = document.querySelectorAll('.hero-slide');
    const indicators = document.querySelectorAll('.indicator');
    
    if (slides.length === 0) return;
    
    // 处理边界
    if (index < 0) index = slides.length - 1;
    if (index >= slides.length) index = 0;
    
    // 确定滑动方向
    let direction = 'next';
    if (index < currentSlide) {
        direction = 'prev';
    } else if (index === currentSlide) {
        return; // 如果是同一张图片，不执行切换
    }
    
    // 移除所有状态类
    slides.forEach(slide => {
        slide.classList.remove('active', 'prev', 'next');
    });
    
    // 设置当前幻灯片为离开状态
    if (slides[currentSlide]) {
        slides[currentSlide].classList.add(direction === 'next' ? 'prev' : 'next');
    }
    
    // 更新指示器状态
    if (indicators[currentSlide]) {
        indicators[currentSlide].classList.remove('active');
    }
    
    // 更新当前幻灯片索引
    currentSlide = index;
    
    // 设置新幻灯片为激活状态
    if (slides[currentSlide]) {
        slides[currentSlide].classList.add('active');
    }
    if (indicators[currentSlide]) {
        indicators[currentSlide].classList.add('active');
    }
}

// 开始自动播放
function startAutoPlay() {
    if (carouselInterval) {
        clearInterval(carouselInterval);
    }
    carouselInterval = setInterval(() => {
        goToSlide(currentSlide + 1);
    }, 3000); // 每3秒自动轮播
}

// 暂停自动播放
function pauseAutoPlay() {
    if (carouselInterval) {
        clearInterval(carouselInterval);
        carouselInterval = null;
    }
}

// 图片错误处理
function initImageErrorHandling() {
    const images = document.querySelectorAll('img');
    images.forEach(img => {
        img.addEventListener('error', function() {
            // 创建fallback内容
            const fallback = document.createElement('div');
            fallback.style.cssText = `
                width: 100%;
                height: 100%;
                background-color: #2b3036;
                color: #ffffff;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                text-align: center;
                padding: 8px;
                box-sizing: border-box;
            `;
            fallback.textContent = this.alt || '图片加载失败';
            
            // 替换图片
            this.style.display = 'none';
            this.parentNode.appendChild(fallback);
        });
    });
}

// 初始化项目点击事件（用于HTML中已有的项目卡片）
function initProjectClickEvents() {
    // 为精选项目添加点击事件
    const portfolioItems = document.querySelectorAll('.portfolio-item[data-project-index]');
    portfolioItems.forEach(item => {
        const index = parseInt(item.getAttribute('data-project-index'));
        if (profileData.profile.portfolio.items && profileData.profile.portfolio.items[index]) {
            const project = profileData.profile.portfolio.items[index];
            if (project.url) {
                item.style.cursor = 'pointer';
                item.addEventListener('click', () => {
                    // 使用带loading效果的跳转函数
                    navigateToProject(project.url, item);
                });
            }
        }
    });
    
    // 为开源项目添加点击事件
    const opensourceItems = document.querySelectorAll('.opensource-item[data-opensource-index]');
    opensourceItems.forEach(item => {
        const index = parseInt(item.getAttribute('data-opensource-index'));
        if (profileData.profile.openSource.items && profileData.profile.openSource.items[index]) {
            const project = profileData.profile.openSource.items[index];
            if (project.url) {
                item.style.cursor = 'pointer';
                item.addEventListener('click', () => {
                    // 使用带loading效果的跳转函数
                    navigateToProject(project.url, item);
                });
            }
        }
    });
    
    // 为精选案例添加点击事件
    const caseItems = document.querySelectorAll('.case-item[data-case-index]');
    caseItems.forEach(item => {
        const index = parseInt(item.getAttribute('data-case-index'));
        if (profileData.profile.cases.items && profileData.profile.cases.items[index]) {
            const caseItem = profileData.profile.cases.items[index];
            const hasValidUrl = caseItem.url && caseItem.url.trim() !== '';
            
            if (hasValidUrl) {
                item.classList.add('clickable');
                item.addEventListener('click', () => {
                    // 使用带loading效果的跳转函数
                    navigateToCase(caseItem.url, item);
                });
            } else {
                item.classList.add('coming-soon');
            }
        }
    });
}

// 窗口大小改变处理
function handleResize() {
    // 可以在这里添加响应式处理逻辑
}

// 监听窗口大小改变
window.addEventListener('resize', handleResize);

// 使用API模块 - 在需要时获取，避免加载时错误

// 底部统计和点赞功能
function initFooterFeatures() {
    // 异步初始化浏览统计
    initViewCount();
    
    // 异步初始化点赞功能
    initLikeButton();
}

// 浏览统计功能
async function initViewCount() {
    const viewCountElement = document.getElementById('viewCount');
    const statsContainer = document.querySelector('.stats-container');
    
    if (!viewCountElement) return;
    
    // 先显示默认值，避免空白
    viewCountElement.textContent = '0';
    
    // 确保浏览统计区域初始可见
    if (statsContainer) {
        statsContainer.style.display = 'flex';
    }
    
    try {
        // 检查API模块是否可用
        if (!window.ProfileAPI || !window.ProfileAPI.ScanAPI) {
            console.warn('API模块未加载，隐藏浏览统计区域');
            if (statsContainer) {
                statsContainer.style.display = 'none';
            }
            return;
        }
        
        // 获取API模块
        const { ScanAPI } = window.ProfileAPI;
        
        // 首先增加浏览计数
        const incrementResult = await ScanAPI.increment();
        
        if (incrementResult.success) {
            const totalCount = incrementResult.data.totalCount;
            
            console.log('浏览统计API调用成功，总数:', totalCount);
            
            // 确保浏览统计区域可见
            if (statsContainer) {
                statsContainer.style.display = 'flex';
                console.log('浏览统计区域已显示');
            }
            
            // 格式化显示数字（添加千位分隔符）
            const formattedCount = totalCount.toLocaleString();
            viewCountElement.textContent = formattedCount;
            
            // 直接显示最终数字，不需要动画效果
        } else {
            // 如果增加失败，尝试获取当前总数
            const countResult = await ScanAPI.getCount();
            if (countResult.success) {
                const totalCount = countResult.data.totalCount;
                
                // 确保浏览统计区域可见
                if (statsContainer) {
                    statsContainer.style.display = 'flex';
                }
                
                const formattedCount = totalCount.toLocaleString();
                viewCountElement.textContent = formattedCount;
                // 直接显示最终数字，不需要动画效果
            } else {
                // 如果API都失败，隐藏浏览统计区域
                console.warn('API调用失败，隐藏浏览统计区域');
                if (statsContainer) {
                    statsContainer.style.display = 'none';
                }
            }
        }
    } catch (error) {
        console.error('浏览统计初始化失败:', error);
        // 隐藏浏览统计区域
        if (statsContainer) {
            statsContainer.style.display = 'none';
        }
    }
}



// 数字动画效果
function animateNumber(element, start, end, duration) {
    const startTime = performance.now();
    const startValue = start;
    const endValue = end;
    
    function updateNumber(currentTime) {
        const elapsed = currentTime - startTime;
        const progress = Math.min(elapsed / duration, 1);
        
        // 使用缓动函数使动画更自然
        const easeOutQuart = 1 - Math.pow(1 - progress, 4);
        const currentValue = Math.floor(startValue + (endValue - startValue) * easeOutQuart);
        
        element.textContent = currentValue.toLocaleString();
        
        if (progress < 1) {
            requestAnimationFrame(updateNumber);
        }
    }
    
    requestAnimationFrame(updateNumber);
}

// 点赞功能
async function initLikeButton() {
    const likeButton = document.getElementById('likeButton');
    const likeCountElement = document.getElementById('likeCount');
    const likeContainer = document.querySelector('.like-container');
    
    if (!likeButton || !likeCountElement) return;
    
    // 先显示默认值，避免空白
    likeCountElement.textContent = '0';
    
    // 确保点赞区域初始可见
    if (likeContainer) {
        likeContainer.style.display = 'flex';
    }
    
    try {
        // 检查API模块是否可用
        if (!window.ProfileAPI || !window.ProfileAPI.FavAPI) {
            console.warn('API模块未加载，隐藏点赞功能区域');
            if (likeContainer) {
                likeContainer.style.display = 'none';
            }
            return;
        }
        
        // 获取API模块
        const { FavAPI } = window.ProfileAPI;
        
        // 首先获取用户点赞状态
        const statusResult = await FavAPI.getStatus();
        
        let isLiked = false;
        let likeCount = 0;
        
        if (statusResult.success) {
            isLiked = statusResult.data.isLiked;
            console.log('点赞状态获取成功，是否已点赞:', isLiked);
        } else {
            // 如果获取状态失败，隐藏点赞功能区域
            console.warn('获取点赞状态失败，隐藏点赞功能区域');
            if (likeContainer) {
                likeContainer.style.display = 'none';
            }
            return;
        }
        
        // 获取点赞总数
        const countResult = await FavAPI.getCount();
        if (countResult.success) {
            likeCount = countResult.data.totalLikes;
            console.log('点赞总数获取成功，总数:', likeCount);
        } else {
            // 如果获取点赞总数失败，隐藏点赞功能区域
            console.warn('获取点赞总数失败，隐藏点赞功能区域');
            if (likeContainer) {
                likeContainer.style.display = 'none';
            }
            return;
        }
        
        // 确保点赞区域可见
        if (likeContainer) {
            likeContainer.style.display = 'flex';
        }
        
        // 更新初始状态
        updateLikeButtonState(isLiked, likeCount);
        
        // 添加点击事件
        likeButton.addEventListener('click', async function() {
            // 防止重复点击
            if (likeButton.disabled) return;
            likeButton.disabled = true;
            
            try {
                // 获取API模块
                const { FavAPI } = window.ProfileAPI;
                let apiResult;
                
                if (isLiked) {
                    // 取消点赞
                    apiResult = await FavAPI.unlike();
                } else {
                    // 点赞
                    apiResult = await FavAPI.like();
                }
                
                if (apiResult.success) {
                    // 更新状态
                    isLiked = apiResult.data.action === 'liked';
                    likeCount = apiResult.data.totalLikes;
                    
                    // 立即更新显示状态
                    updateLikeButtonState(isLiked, likeCount);
                    
                    // 添加点赞动画效果（保留动画）
                    if (isLiked) {
                        likeButton.classList.add('liked');
                        // 添加动画效果，然后保持高亮状态
                        setTimeout(() => {
                            likeButton.classList.remove('liked');
                            setTimeout(() => {
                                likeButton.classList.add('liked');
                            }, 50);
                        }, 300);
                    } else {
                        likeButton.classList.remove('liked');
                    }
                    
                    // 显示反馈信息
                    showLikeFeedback(isLiked, apiResult.data.message);
                } else {
                    // API调用失败，显示错误信息
                    showLikeFeedback(isLiked, apiResult.error || '操作失败');
                }
            } catch (error) {
                console.error('点赞操作失败:', error);
                showLikeFeedback(isLiked, '网络请求失败');
            } finally {
                // 重新启用按钮
                likeButton.disabled = false;
            }
        });
        
    } catch (error) {
        console.error('点赞功能初始化失败:', error);
        // 隐藏点赞功能区域
        if (likeContainer) {
            likeContainer.style.display = 'none';
        }
    }
}



// 更新点赞按钮状态
function updateLikeButtonState(isLiked, count) {
    const likeButton = document.getElementById('likeButton');
    const likeCountElement = document.getElementById('likeCount');
    const likeTextElement = likeButton.querySelector('.like-text');
    
    // 强制重新计算样式，确保CSS类正确应用
    if (isLiked) {
        likeButton.classList.add('liked');
        likeTextElement.textContent = '已点赞';
    } else {
        likeButton.classList.remove('liked');
        likeTextElement.textContent = '点赞';
    }
    
    // 强制触发重绘
    likeButton.offsetHeight;
    
    likeCountElement.textContent = count.toString();
}

// 显示点赞反馈
function showLikeFeedback(isLiked, customMessage = null) {
    let message;
    if (customMessage) {
        message = customMessage;
    } else {
        message = isLiked ? '感谢您的点赞！' : '已取消点赞';
    }
    
    // 创建临时提示元素
    const toast = document.createElement('div');
    toast.textContent = message;
    toast.style.cssText = `
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: rgba(0, 0, 0, 0.8);
        color: white;
        padding: 12px 20px;
        border-radius: 20px;
        font-size: 14px;
        font-weight: 500;
        z-index: 1000;
        opacity: 0;
        transition: opacity 0.3s ease;
    `;
    
    document.body.appendChild(toast);
    
    // 显示动画
    setTimeout(() => {
        toast.style.opacity = '1';
    }, 10);
    
    // 自动隐藏
    setTimeout(() => {
        toast.style.opacity = '0';
        setTimeout(() => {
            document.body.removeChild(toast);
        }, 300);
    }, 1500);
} 